<template>
  <a-modal
      v-model:visible="visible"
      title="操作详情"
      ok-text="确认"
      :hideCancel="true"
      :mask-closable="false"
      @cancel="handleCancel"
      @before-ok="handleSubmit"
      width="600px"
  >
    <div class="flex-column">
      <table>
        <tr>
          <td>id</td>
          <td>{{ data.id }}</td>
        </tr>
        <tr>
          <td>类型</td>
          <td>{{ data.type }}</td>
        </tr>
        <tr>
          <td>ip</td>
          <td>{{ data.ip }}</td>
        </tr>
        <tr>
          <td>时间</td>
          <td>{{ data.createTime }}</td>
        </tr>
        <tr>
          <td>详情</td>
          <td>
            <a-textarea v-model="data.content" style="height: 200px;"></a-textarea>
          </td>
        </tr>
      </table>

    </div>
  </a-modal>
</template>

<script setup>
import apiAll from "@/api/apiAll.js";
import {ref} from "vue";

const data = ref({});
const visible = ref(false);
const handleSubmit = (done) => {
  done()
};

const handleCancel = () => {
  visible.value = false;
};

const show = (id) => {
  apiAll.actionApi.get(id).then(res => {
    data.value = res.data
    data.value.content = JSON.stringify(data.value, null, 2)
  })
  visible.value = true;
};

defineExpose({show});
</script>
